<template>
  <van-icon :color="likeList===1?'hotpink':'#777'" :name="likeList===1?'good-job':'good-job-o'" @click="onLike" />
</template>

<script>
// 导入接口
import { addLike, cancelLike } from '@/api/article.js'
export default {
  model: {
    prop: 'likeList'
  },
  props: {
    likeList: {
      type: Number,
      require: true
    },
    articleId: {
      type: [Number, Object],
      require: true
    }
  },
  name: 'like-article',
  data () {
    return {}
  },
  methods: {
    async onLike () {
      this.$toast.loading({
        duration: 0, // 持续展示toast
        message: '操作中',
        forbidclick: 'true' // 禁止点击背景
      })

      try {
        if (this.likeList === 1) {
          // 取消点赞
          await cancelLike(this.articleId)
          // 恢复默认
          this.$emit('defalutLikeValue', -1)
        } else {
          await addLike(this.articleId)
          this.$emit('updateLikeValue', 1)
        }
        this.$toast.success(this.likeList === 1 ? '取消点赞' : '点赞成功')
      } catch (err) {
        // console.log(err)
        this.$toast('操作失败,请重试')
      }
    }
  },
  computed: {},
  watch: {},
  filters: {},
  components: {},
  created () { },
  mounted () { }
}
</script>

<style lang='less' scoped>
</style>
